

<%@page contentType="text/html" pageEncoding="UTF-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
    "http://www.w3.org/TR/html4/loose.dtd">
<%@taglib uri="http://struts.apache.org/tags-bean"  prefix="bean"%>
<%@taglib uri="http://struts.apache.org/tags-html" prefix="html"%>
<%@taglib uri="http://struts.apache.org/tags-logic" prefix="logic"%>
<%@ taglib uri="/tags/c" prefix="c"%>
<%@ include file="seguridad.jsp" %>
<script src="scripts/ajax.js" language="JavaScript"></script>


<html>
    <script LANGUAGE="JavaScript">
        


    function insertar(){
            var opc=document.getElementById("opcmarco").value;

            if (opc==1){
            var tipo=document.getElementById("opcProgestr").value;
            var pk = document.getElementById("pk").value;
            var pk2 = document.getElementById("pk2").value;
            var opc=document.getElementById("opcmarco").value;
            var cancomp = 0;
            var canfin = document.getElementById("cantidadFin").value;
            var canprop = 0;
            var proy=document.getElementById("codProy").value;
            

            var idDiv = "divTablaP";
            var metodo = "GET";
           var url = "consultasAjax/listarMarcoLogicoFAjax.jsp?canfin="+canfin+"&canprop="+canprop+
                "&cancomp="+cancomp+"&tipo="+tipo+"&pk="+pk+"&pk2="+pk2+"&opc="+opc+"&proy="+proy;
            var cadenaSalida = "";
            var async = true;
            document.getElementById(idDiv).innerHTML;
            autoCompletarDiv(metodo,url,cadenaSalida,async,idDiv);
            document.getElementById("opcProgestr").value=1;
            document.getElementById("cantidadFin").value = "";
            }
            if (opc==2){
            var tipo=document.getElementById("opcProgestr").value;
            var pk = document.getElementById("pk").value;
            var pk2 = document.getElementById("pk2").value;
            var opc=document.getElementById("opcmarco").value;
            var cancomp = 0;
            var canfin = 0;
            var canprop = document.getElementById("cantidadProposito").value;
            var proy=document.getElementById("codProy").value;
            var idDiv = "divTablaP";
            var metodo = "GET";
           var url = "consultasAjax/listarMarcoLogicoFAjax.jsp?canfin="+canfin+"&canprop="+canprop+
                "&cancomp="+cancomp+"&tipo="+tipo+"&pk="+pk+"&pk2="+pk2+"&opc="+opc+"&proy="+proy;
            var cadenaSalida = "";
            var async = true;
            document.getElementById(idDiv).innerHTML;
            autoCompletarDiv(metodo,url,cadenaSalida,async,idDiv);
            document.getElementById("opcProgestr").value=1;
            document.getElementById("cantidadProposito").value="";
            }
            if (opc==3){
            var tipo=document.getElementById("opcProgestr").value;
            var pk = document.getElementById("pk").value;
            var pk2 = document.getElementById("pk2").value;
            var cancomp = document.getElementById("cantidadComponentes").value;
            var canfin = 0;
            var canprop = 0;
            var opc=document.getElementById("opcmarco").value;
            var proy=document.getElementById("codProy").value;

            var idDiv = "divTablaP";
            var metodo = "GET";
           var url = "consultasAjax/listarMarcoLogicoFAjax.jsp?canfin="+canfin+"&canprop="+canprop+
                "&cancomp="+cancomp+"&tipo="+tipo+"&pk="+pk+"&pk2="+pk2+"&opc="+opc+"&proy="+proy;
            var cadenaSalida = "";
            var async = true;
            document.getElementById(idDiv).innerHTML;
            autoCompletarDiv(metodo,url,cadenaSalida,async,idDiv);
            document.getElementById("opcProgestr").value=1;
            document.getElementById("cantidadComponentes").value="";
            }

        }


         function insertarI(){
            var opc=document.getElementById("opcmarco").value;

            if (opc==1){
            var tipo=document.getElementById("opcProgestr").value;
            var pk = document.getElementById("pk").value;
            var pk2 = document.getElementById("pk2").value;
            var opc=document.getElementById("opcmarco").value;
            var cancomp = 0;
            var canfin = document.getElementById("cantidadFin").value;
            var canprop = 0;
            var proy=document.getElementById("codPrograma").value;

            var idDiv = "divTablaI";
            var metodo = "GET";
           var url = "consultasAjax/listarMarcoLogicoIAjax.jsp?canfin="+canfin+"&canprop="+canprop+
                "&cancomp="+cancomp+"&tipo="+tipo+"&pk="+pk+"&pk2="+pk2+"&opc="+opc+"&proy="+proy;
            var cadenaSalida = "";
            var async = true;
            document.getElementById(idDiv).innerHTML;
            autoCompletarDiv(metodo,url,cadenaSalida,async,idDiv);
            document.getElementById("opcProgestr").value=1;
            document.getElementById("cantidadFin").value = "";
            }
            if (opc==2){
            var tipo=document.getElementById("opcProgestr").value;
            var pk = document.getElementById("pk").value;
            var pk2 = document.getElementById("pk2").value;
            var opc=document.getElementById("opcmarco").value;
            var cancomp = 0;
            var canfin = 0;
            var canprop = document.getElementById("cantidadProposito").value;
            var proy=document.getElementById("codPrograma").value;
            var idDiv = "divTablaI";
            var metodo = "GET";
           var url = "consultasAjax/listarMarcoLogicoIAjax.jsp?canfin="+canfin+"&canprop="+canprop+
                "&cancomp="+cancomp+"&tipo="+tipo+"&pk="+pk+"&pk2="+pk2+"&opc="+opc+"&proy="+proy;
            var cadenaSalida = "";
            var async = true;
            document.getElementById(idDiv).innerHTML;
            autoCompletarDiv(metodo,url,cadenaSalida,async,idDiv);
            document.getElementById("opcProgestr").value=1;
            document.getElementById("cantidadProposito").value="";
            }
            if (opc==3){
            var tipo=document.getElementById("opcProgestr").value;
            var pk = document.getElementById("pk").value;
            var pk2 = document.getElementById("pk2").value;
            var cancomp = document.getElementById("cantidadComponentes").value;
            var canfin = 0;
            var canprop = 0;
            var opc=document.getElementById("opcmarco").value;
            var proy=document.getElementById("codPrograma").value;

            var idDiv = "divTablaI";
            var metodo = "GET";
           var url = "consultasAjax/listarMarcoLogicoIAjax.jsp?canfin="+canfin+"&canprop="+canprop+
                "&cancomp="+cancomp+"&tipo="+tipo+"&pk="+pk+"&pk2="+pk2+"&opc="+opc+"&proy="+proy;
            var cadenaSalida = "";
            var async = true;
            document.getElementById(idDiv).innerHTML;
            autoCompletarDiv(metodo,url,cadenaSalida,async,idDiv);
            document.getElementById("opcProgestr").value=1;
            document.getElementById("cantidadComponentes").value="";
            }

        }



    function editarF(codpk2,codpk,desc,num,tipo){
            document.getElementById("opcProgestr").value=1;
            document.getElementById("cantidadFin").value=desc;
            document.getElementById("pk").value=codpk;
            document.getElementById("pk2").value=codpk2;
            document.getElementById("opcmarco").value=num;
            document.getElementById("codProy").value=tipo;
            validar();
            }

            function editarP(codpk2,codpk,desc,num,tipo){
            document.getElementById("opcProgestr").value=1;
            document.getElementById("cantidadProposito").value=desc;
            document.getElementById("pk").value=codpk;
            document.getElementById("pk2").value=codpk2;
            document.getElementById("opcmarco").value=num;
            document.getElementById("codProy").value=tipo;
            validar();
            }

            function editarC(codpk2,codpk,desc,num,tipo){
            document.getElementById("opcProgestr").value=1;
            document.getElementById("cantidadComponentes").value=desc;
            document.getElementById("pk").value=codpk;
            document.getElementById("pk2").value=codpk2;
            document.getElementById("opcmarco").value=num;
            document.getElementById("codProy").value=tipo;
            validar();
            }



            function editarFI(codpk2,codpk,desc,num,tipo){
            document.getElementById("opcProgestr").value=1;
            document.getElementById("cantidadFin").value=desc;
            document.getElementById("pk").value=codpk;
            document.getElementById("pk2").value=codpk2;
            document.getElementById("opcmarco").value=num;
            document.getElementById("codPrograma").value=tipo;
            validar();
            }


            

            function editarPI(codpk2,codpk,desc,num,tipo){
            document.getElementById("opcProgestr").value=1;
            document.getElementById("cantidadProposito").value=desc;
            document.getElementById("pk").value=codpk;
            document.getElementById("pk2").value=codpk2;
            document.getElementById("opcmarco").value=num;
            document.getElementById("codPrograma").value=tipo;
            validar();
            }

            function editarCI(codpk2,codpk,desc,num,tipo){
            document.getElementById("opcProgestr").value=1;
            document.getElementById("cantidadComponentes").value=desc;
            document.getElementById("pk").value=codpk;
            document.getElementById("pk2").value=codpk2;
            document.getElementById("opcmarco").value=num;
            document.getElementById("codPrograma").value=tipo;
            validar();
            }


            function validar(){
                if((document.getElementById("opcmarco").value)==1){
                    document.getElementById("cantidadProposito").disabled = true;
                    document.getElementById("cantidadComponentes").disabled = true;
                    document.getElementById("cantidadFin").disabled = false;
                    document.getElementById("cantidadProposito").value = "";
                    document.getElementById("cantidadComponentes").value= "";
                    document.getElementById("btng1").disabled = false;
            //document.getElementById("btng2").disabled = false;
                }
                if((document.getElementById("opcmarco").value)==2){
                    document.getElementById("cantidadProposito").disabled = false;
                    document.getElementById("cantidadComponentes").disabled = true;
                    document.getElementById("cantidadFin").disabled = true;
                    document.getElementById("cantidadFin").value = "";
                    document.getElementById("cantidadComponentes").value= "";
                    document.getElementById("btng1").disabled = false;
            //document.getElementById("btng2").disabled = false;
                }
                if((document.getElementById("opcmarco").value)==3){
                    document.getElementById("cantidadProposito").disabled = true;
                    document.getElementById("cantidadComponentes").disabled = false;
                    document.getElementById("cantidadFin").disabled = true;
                    document.getElementById("cantidadFin").value = "";
                    document.getElementById("cantidadProposito").value= "";
                    document.getElementById("btng1").disabled = false;
            //document.getElementById("btng2").disabled = false;
                }

            }



function verTipo(num){

        if(num==1){
            document.getElementById("mantenimiento").style.display="";
            document.getElementById("grabar1").style.display="";
            document.getElementById("grabar2").style.display="none";
            document.getElementById("divTabla").style.display="";
            document.getElementById("divTablaI").style.display="none";
            document.getElementById("inversion").style.display="none";
            document.getElementById("prog").style.display="";
            document.getElementById("divTablaP").style.display="";
            
        }else{
            document.getElementById("mantenimiento").style.display="";
            document.getElementById("divTabla").style.display="none";
            document.getElementById("inversion").style.display="";
            document.getElementById("divTablaI").style.display="";
            document.getElementById("grabar1").style.display="none";
            document.getElementById("grabar2").style.display="";
            document.getElementById("prog").style.display="none";
            document.getElementById("divTablaP").style.display="none";

        }


    }



            




        function listarI(){
            var tipo=document.getElementById("opcProgestr").value;
            var proy=document.getElementById("codPrograma").value;
            var canfin = 0;
            var canprop = 0;
            var cancomp = 0;
            var pk=0;
            var pk2=0;
            var opc=0;
            var idDiv = "divTablaI";
            var metodo = "GET";
            var url = "consultasAjax/listarMarcoLogicoIAjax.jsp?canfin="+canfin+"&canprop="+canprop+
                "&cancomp="+cancomp+"&tipo="+tipo+"&pk="+pk+"&pk2="+pk2+"&opc="+opc+"&proy="+proy;
            var cadenaSalida = "";
            var async = true;
            document.getElementById(idDiv).innerHTML;
            autoCompletarDiv(metodo,url,cadenaSalida,async,idDiv);
            document.getElementById("opcProgestr").value=1;
        }

        function listar(){
            var tipo=document.getElementById("opcProgestr").value;
            var proy=document.getElementById("codProy").value;
            var canfin = 0;
            var canprop = 0;
            var cancomp = 0;
            var pk=0;
            var pk2=0;
            var opc=0;
            var idDiv = "divTablaP";
            var metodo = "GET";
            var url = "consultasAjax/listarMarcoLogicoFAjax.jsp?canfin="+canfin+"&canprop="+canprop+
                "&cancomp="+cancomp+"&tipo="+tipo+"&pk="+pk+"&pk2="+pk2+"&opc="+opc+"&proy="+proy;
            var cadenaSalida = "";
            var async = true;
            document.getElementById(idDiv).innerHTML;
            autoCompletarDiv(metodo,url,cadenaSalida,async,idDiv);
            document.getElementById("opcProgestr").value=1;
        }



        function iniciar(){
            document.getElementById("grabar2").style.display="none";
            document.getElementById("grabar1").style.display="none";
            document.getElementById("mantenimiento").style.display="none";
            document.getElementById("inversion").style.display="none";
            document.getElementById("prog").style.display="none";
            //document.getElementById("btng1").disabled = true;
            //document.getElementById("btng2").disabled = true;
        }




        function autoCompletarDiv(metodo,url,cadena,async,idDiv)
        {
            if( window.XMLHttpRequest )
                ajax = new XMLHttpRequest(); // No Internet Explorer
            else
                ajax = new ActiveXObject("Microsoft.XMLHTTP");
            ELEMENT_DIV = idDiv;
            ajax.onreadystatechange = funcionCallbackVerDiv;
            ajax.open( metodo, url, async);
            ajax.send(cadena);
        }

        function funcionCallbackVerDiv()
        {
            if( ajax.readyState == 4 )
            {
                if( ajax.status == 200 )
                { //alert(ajax.responseText);
                    document.getElementById(ELEMENT_DIV).innerHTML = ajax.responseText;
                }
            }
        }
    </script>

    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <link rel="stylesheet" href="lib/css/estilos.css" type="text/css">
         <link href="lib/css/styles_pages.css" rel="stylesheet" type="text/css" />
        <title>JSP Page</title>
    </head>
    <body onload="iniciar()">
            <div style="overflow: auto; width: 700px; height: 400px">
        <center>
            <h1>Avance Anual de Marco Logico</h1>
            <table>
                <tr>
                    <td width="300">
                        <html:form action="ProgEstra.do?dispatch=insertarrMarcoLogico" styleId="ProgEstrForm">
                            <html:hidden property="opcProgestr" styleId="opcProgestr" value="1"/>
                            <html:hidden property="pk" styleId="pk" value="0"/>
                            <html:hidden property="pk2" styleId="pk2" value="0"/>
                            <html:hidden property="opcmarco" styleId="opcmarco" value="0"/>
                            <fieldset>
                        Programa : <html:radio property="numCriterio" value="2"  onclick="verTipo(1)" />
                        Proyecto : <html:radio   property="numCriterio" value="1" onclick="verTipo(0)"   />
                        <table  width="100%" align="center" id="inversion">
                <tr>
                    <td width="50%" align="right">
                        Proyecto de Inversion
                    </td>
                    <td width="50%">
                        <html:select property="codPrograma" styleId="codPrograma" onchange="listarI()">
                            <html:option value="-1">[--Seleccionar Proyecto de Inversion--]</html:option>
                            <html:optionsCollection name="ProgEstrForm" property="listPrograma" value="NUM_PYINV_PK" label="TX_NOMBREPYI" />
                        </html:select>
                    </td>
                </tr>
            </table>
                        <table  width="100%" align="center" id="prog">
                <tr>
                    <td width="50%" align="right">
                        Programa Estrategico
                    </td>
                    <td width="50%">
                        <html:select property="codProy" styleId="codProy" onchange="listar()">
                            <html:option value="-1">[--Seleccionar Programa--]</html:option>
                            <html:optionsCollection name="ProgEstrForm" property="listProyecto" value="NUM_PYINV_PK" label="TX_NOMBREPYI" />
                        </html:select>
                    </td>
                </tr>
            </table>
                    <table id="mantenimiento">
					<tr>
						<td>Cantidad de Avance Finalidad</td>
						<td><html:text styleId="cantidadFin" property="cantidadFin"
							maxlength="400" /></td>
					</tr>
                                        <tr>
						<td>Cantidad de Avance Propopsito</td>
						<td><html:text styleId="cantidadProposito" property="cantidadProposito"
							maxlength="400" /></td>
					</tr>
                                        <tr>
						<td>Cantidad de Avance Componente</td>
						<td><html:text styleId="cantidadComponentes" property="cantidadComponentes"
							maxlength="400" /></td>
					</tr>
                                        </table>

                                        <table id="grabar1">
                                        <tr>
                                            <td colspan="2" align="center"><input id="btng1" type="button"
						value="Grabar Programa" onclick="insertar()" /></td>
				</tr>
                                        </table>

                                        <table id="grabar2" >
                                        <tr>
                                            <td colspan="2" align="center" ><input id="btng2" type="button"
						value="Grabar proyecto" onclick="insertarI()" /></td>
				</tr>
                                        </table>

                                </fieldset>
                                
                                <div id="divTabla">  
                                </div>
                                <div id="divTablaI">
                                </div>
                                <div id="divTablaP">
                                </div>
                          
                        </html:form>
                    </td>
                </tr>
            </table>
        </center>
            </div>
    </body>
</html>